<template>
	<view>
		<view class="hot_goods">
			<view class="hot_goods_item" v-for="item in GoodsList" :key="item.goods_id">
				<image :src="item.goods_small_logo" mode="aspectFit"></image>
				<view class="hot_goods_price">￥{{item.goods_price}}</view>
				<view class="hot_goods_name">{{item.goods_name}}...</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {get_Swiper,get_Goods} from 'request/api.js' 
	export default {
		data() {
			return {
				SwiperList:[],
				GoodsList:[],
				pagenum:2,
			}
		},
		onLoad() {
			
		   get_Swiper(null).then(res=>{
			   this.SwiperList=res.data.message
		   })
		   get_Goods({pagenum:this.pagenum,pagesize:6}).then(res=>{
			   console.log("商品数据",res.data.message.goods)
			   this.GoodsList=res.data.message.goods;
			   this.pagenum++;
		   })
			
		},
		onReachBottom() {
			uni.showNavigationBarLoading();
			get_Goods({pagenum:this.pagenum,pagesize:6}).then(res=>{
				this.GoodsList=this.GoodsList.concat(res.data.message.goods)
				console.log("拼接后的数组",this.GoodsList)
				this.pagenum++;
				uni.hideNavigationBarLoading();
			})
		},
		methods: {
			
		}
	}
</script>

<style scoped lang="scss">
    .hot_goods{display: flex;flex-wrap: wrap;background-color: #eee;padding: 10rpx;justify-content: space-around;}
	.hot_goods_item{width: 355rpx;background-color: white;margin-top: 8rpx;height: 428rpx;overflow: hidden;text-overflow:ellipsis;white-space: wrap;}
	.hot_goods_item>image{width: 300rpx;height: 300rpx;margin-left: 27.5rpx;}
	.hot_goods_price{color: red;margin-left: 27.5rpx;}
	.hot_goods_name{font-size: 30rpx;margin-left: 27.5rpx;}
</style>
